import Vue from 'vue'
import Vuex from 'vuex'

// 引入axios
import axios from 'axios'
import a from './a'
import b from './b'
Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    list:[{title:'背题',status:true,id:1},{title:'吃饭',status:false,id:2},{title:'睡觉',status:false,id:3}],
    message:'加油吧',
    str:'123',
    flag:'456'
  },
  getters: {
    doing(state){
       return state.list.filter(item=>item.status == false).length
    },
    done(state){
        return state.list.filter(item=>item.status == true).length
    }
  },
  mutations: {
    // 添加任务
    add(state,title){
        state.list.push({
            id:new Date().getTime(),
            title:title,
            status:false
        })
    },
    remove(state,id){
        // 循环遍历  找到符合条件的下标
        // state.list.forEach((item,index)=>{
        //     if(item.id == id){
        //         state.list.splice(index,1)
        //     }
        // })
        // findIndex 找到满足条件的下标  根据下标删除
        // let index = state.list.findIndex(item=>item.id == id)
        // state.list.splice(index,1)

        // 留下不删除的
        state.list =  state.list.filter(item=>item.id != id)
    },
    setTaskList(state,data){
         state.list = data
    }
  },
  actions: {
    // 存放异步   actons方法的第一个参数是context，他没有直接权利修改state，必须通过mutations，如果想要调用actions里面的方法
    // 要使用dispatch('方法名')
    getList(context){
        // console.log(context);//执行上下文 上下问指的就是vuex的整个环境
        console.log(this);
        axios.get('./data.json').then(res=>{
            console.log(res);
            context.commit('setTaskList',res.data.list)
        })
    }

  },
  modules: {
     a,
     b
  }
})


